import { createElement, HTMLAttributes, type FC } from 'react';
import classNames from 'classnames';
import { iconDefaultProps } from './defaultProps';
import type { IconOptions } from './type';

export interface IconProps extends IconOptions, Omit<HTMLAttributes<HTMLElement>, 'color'> {}

const Icon: FC<IconProps> = (props) => {
  const {
    className,
    name,
    disabled,
    loading,
    fitted,
    size,
    link,
    flipped,
    rotated,
    circular,
    bordered,
    color,
    inverted,
    forwardedRef,
    ...iconProps
  } = props;

  return createElement('i', {
    ref: forwardedRef,
    className: classNames(
      name,
      size,
      color,
      flipped,
      rotated,
      { disabled, loading, fitted, link, flipped, rotated, circular, bordered, inverted },
      'icon',
      className,
    ),
    ...iconProps,
  });
};

Icon.displayName = 'Icon';
Icon.defaultProps = iconDefaultProps;

export default Icon;
